FlyTalk.views.Servicepastaperfecto = Ext.extend(Ext.Panel, {
	fullscreen: true,
	title: 'Servicepastaperfecto',
	scroll: true,
	width: 290,
	
//	items: [{
//		//id: 'servicedetail',
//		html: '<div style="line-height: 1.5em; font-size: medium; margin: 1em;"><b>Description:</b> Italian food<br><b>Walk time:</b> 6 min<br>'+
//			  '<b>Wait time:</b> 5 min<br><b>Price:</b> $ <br><img src="images/thumbsUP_postscopy.png" width="15px" />: 82% <br><b>Deals: </b>Get a free side of breadsticks with any pasta order.<br><b>Menu: </b><br>'+
//			  'Spaghetti Calamari 11 Euros 7 <img src="images/thumbsUP_postscopy.png" width="15px" /><br>'+
//			  'Spaghetti Bolognese 8 Euros 6 <img src="images/thumbsUP_postscopy.png" width="15px" /><br>'+
//			  'Spaghetti Pesto 8 Euros 5 <img src="images/thumbsUP_postscopy.png" width="15px" /><br>'+
//			  'Spaghetti Napoli 8 Euros 5 <img src="images/thumbsUP_postscopy.png" width="15px" /><br>'
//			  
//		},
//		{
//			xtype: 'button',
//			text: 'view on map',
//			handler: function(){
//				Ext.get('serviceMap').update('<div><img id="tp" src="./images/map_pasta.png"></img></div>');
//				FlyTalk.views.ServiceMap.toolbar.setTitle("Pasta Perfecto");
//				FlyTalk.views.mainView.setActiveItem(FlyTalk.views.ServiceMap, {type: 'slide', direction: 'right'});
//			},
//			style: 'margin: 1em',
//		}
//	],
//	
	
	initComponent: function () {
		this.backButton = new Ext.Button({
			text: 'Back',
			ui: 'back',
			handler: this.backButtonTap,
			scope: this
		});
		
		this.toolbar = new Ext.Toolbar({
			id: 'toolbar',	
			title: 'Pasta Perfecto',
			doc: 'top',
			layout: 'hbox',
			items: [
				this.backButton,
				{xtype: 'spacer'},
				
			]
		});
		
		this.menuButtonTpl = new Ext.XTemplate(
				'<div class="home-buttons"><img src={src} alt="" width="320" /></div>'
			);

			this.pastabutton = new Ext.Button({
				data:{
					src: "images/pasta_detail.png",
				},
				baseCls: "menuButton",
				pressedCls: "menuButtonPressed",
				tpl:this.menuButtonTpl,
				//flex: 1,
				//width: '70%',
				handler: function(){
					Ext.get('serviceMap').update('<div><img id="tp" src="./images/map_pasta.png"></img></div>');
					FlyTalk.views.ServiceMap.toolbar.setTitle("Pasta Perfecto");
					FlyTalk.views.mainView.setActiveItem(FlyTalk.views.ServiceMap, {type: 'slide', direction: 'right'});
				},
				scope: this,
				//style: 'margin: 1em',
			});
		
		this.dockedItems = [this.toolbar];	
		this.items = [this.pastabutton];
	
		FlyTalk.views.Servicepastaperfecto.superclass.initComponent.call(this);
        
    },
	

		
	backButtonTap: function () {
        Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'closeServiceDetailView'
        });
    },

});